<script setup>
import { onMounted, onUnmounted, ref } from 'vue'
import { useBasicData } from '@/store/index'
import zhCN from 'ant-design-vue/es/locale/zh_CN'
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import { useLoadingStore } from './store/loading'
dayjs.locale('zh-cn')
const locale = ref(zhCN)
const basicData = useBasicData()
onMounted(() => {
  window.addEventListener('resize', updateHeight)
  updateHeight()
})
onUnmounted(() => {
  window.removeEventListener('resize', updateHeight)
})

const updateHeight = () => {
  basicData.contentHeight = window.innerHeight
}
const loadingStore = useLoadingStore()
</script>

<template>
  <a-config-provider :locale="locale">
    <a-spin
      :spinning="loadingStore.loading"
      size="large"
      tip="加载中, 请稍等..."
      wrapper-class-name="loading"
    >
      <router-view />
    </a-spin>
  </a-config-provider>
</template>
<style scoped lang="less">
// 修改antd的loading样式
.loading {
  height: 100%;
  :deep(.ant-spin-container) {
    height: 100%;
    &::after {
      background-color: transparent;
    }
  }
  :deep(.ant-spin-spinning) {
    max-height: 100%;
    z-index: 99999;
  }
  :deep(div.ant-spin-text) {
    text-shadow: none;
  }
  :deep(.ant-spin-blur) {
    opacity: 1;
  }
}
</style>
